<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../../js/layer/css/layui.css">
    <style>
        .left-tr{
            text-align: left!important;
        }
        .right-tr{
            text-align: left!important;
        }
    </style>
</head>
<body style="padding: 15px;">
<table class="layui-table">

    <thead>

    <tr>

        <th width="50%" class="left-tr">标签名</th>

        <th width="50%" class="right-tr">操作</th>

    </tr>

    </thead>

    <tbody id="tag-html">

    <tr>

        <td class="left-tr" rowspan="2" colspan="2"></td>

    </tr>

    </tbody>

</table>

<pre id="precode">

</pre>

<script src="../../js/layer/layui.js"></script>
<script type="text/javascript">
    ready(function() {
        var menuId = 'Cloudvolume';
        layui.use(['zhanshop'], function(){
            var $ = layui.$;
            var zhanshop = layui.zhanshop;
            layui.zhanshop.ajax(API_ADDRESS+apiUrlTable+'/'+menuId, 'POST', {"_method": "tags", "name": zhanshop.getParam("name")}, {}, function(res){
                var tags = res.data.tags
                if(tags.length > 0){
                    var tableHtml = '';
                    for(var i in tags){
                        tableHtml += '<tr><td class="left-tr">'+tags[i]+'</td><td class="right-tr"><a href="javascript:void(0)" onclick="switchBranch(\''+tags[i]+'\')">拉取</a></td></tr>';
                    }
                    $("#tag-html").html(tableHtml);
                }else{

                    var address = 'ws://'+window.location.host+'/v1/cloud.pullVolume?name='+zhanshop.getParam("name");

                    try{
                        var WbSocket = new WebSocket(address);
                    }catch (e) {
                        console.warn(e);
                    }

                    WbSocket.onmessage = function (evt)
                    {
                        if(evt.data == "close" && res.data.empty){
                            window.location.reload();
                        }
                        document.getElementById('precode').innerHTML += evt.data;
                    };
                    WbSocket.onclose = function(evt)
                    {
                        WbSocket = null;
                    };

                    WbSocket.onerror = function(error)
                    {
                        console.error(error);
                    };
                }
            },function(xhr){
                return layui.zhanshop.alert(xhr.responseJSON.msg ? xhr.responseJSON.msg : xhr.statusText, 'danger');
            });

            window.switchBranch = function (tagName){
                layui.zhanshop.ajax(API_ADDRESS+apiUrlTable+'/'+menuId, 'POST', {"_method": "checkout", "name": zhanshop.getParam("name"), "tab": tagName}, {}, function(res){
                    zhanshop.alert("执行完毕\n"+res.data.msg, 'info', function (){
                        parent.layer.closeAll();
                    });
                },function(xhr){
                    return layui.zhanshop.alert(xhr.responseJSON.msg ? xhr.responseJSON.msg : xhr.statusText, 'danger');
                });
            }
        });
    });
</script>

</body>
</html>